import React, { useEffect, useState } from 'react'
import styles from './index.module.less'
import yellow_cloth from '@/resource/jobAbility/yellow_cloth.png'
import { observer, useLocalObservable } from 'mobx-react'
import jobAbility from '../store'
import { history, useParams } from 'umi'
import TaskFinshModal from '@/components/TaskFinishModal'
import Radar from '../components/Radar'
import BtnBotLayout from '@/components/BtnBotLayout'

export default observer(function Result() {
    const store = useLocalObservable(() => jobAbility)
    const { getTestEvalsRecordView, radarInfo, resultData } = store
    const { id } = useParams<any>()

    useEffect(() => {
        getTestEvalsRecordView(id)
        document.title = resultData?.testEval?.name || ''
        return () => {
            document.title = ''
        }
    }, [resultData?.testEval?.name])

    return (
        <div className={styles.container}>
            <BtnBotLayout
                footer={
                    <div className={styles.footer}>
                        <div
                            className={styles.save_btn}
                            onClick={() => {
                                history.goBack()
                            }}
                        >
                            返回列表
                        </div>
                    </div>
                }
            >
                <div className={styles.wrapper}>
                    <div className={styles.time}>填写时间：{resultData?.create_time}</div>
                    <div className={styles.radar_box}>
                        <div className={styles.radar_title}>{resultData?.testEval?.name}</div>
                        <Radar data={radarInfo as any} />
                    </div>
                </div>
            </BtnBotLayout>
        </div>
    )
})
